<template>
    <section class="main">
        <ul class="todo-list">
            <li class="todo" v-for="(item, i) in list" :key="item.id">
                <div class="view">
                    <span class="index">{{ i + 1 }}</span> <label>{{ item.title }}</label>
                    <button class="destroy" @click="$emit('delByIndex', i)"></button>
                </div>
            </li>
        </ul>
    </section>
</template>

<script>
export default {
    props: {
        list: Array
    }
}
</script>
